<template>
	<view class="pay-result">
		<image src="/static/img/success.svg" class="pay-result-icon"></image>
		<text class="pay-result-err">支付成功</text>
    <text style="margin-top: 30rpx ; color:#00000059 ;">{{ 	vdata.member?'会员支付':'普通支付'  }}</text>
		<view class="pay-result-amount">
			<text class="pay-result-amount-text">金额：<text style="color: #FC0100;">￥</text></text>
			<text class="pay-result-amount-value">{{ doubleToThousands(vdata.amount) }}</text>
		</view>
		
		<view class="ad-wrapper" v-if="vdata.advertUrl" @tap="toH5">
			<image mode="aspectFill" :src="vdata.advertUrl"></image>
		</view>
		<!-- #ifdef MP-WEIXIN -->
		<button v-if="appConfig.scene == 1069" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}" open-type="launchApp" :app-parameter="'success'" @error="launchAppError">完  成</button>
		<button v-else-if="appConfig.scene == 1037" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}" @click="backMiniFunc">完  成</button>
		<navigator v-else open-type="exit" target="miniProgram" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}">完  成</navigator>
		<!-- #endif -->
		<!-- #ifdef MP-ALIPAY -->
		<navigator open-type="exit" target="miniProgram" class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}">完  成</navigator>
		<!-- #endif -->
		<!-- #ifndef MP-WEIXIN || MP-ALIPAY -->
		<view class="back-btn" :style="{'backgroundColor': vdata.primaryColor || '#F1F1F1'}" @click="back">完  成</view>
		<!-- #endif -->
	</view>
</template>

<script setup>
	import { doubleToThousands } from '@/util/amount.js'
	import { onLoad,onUnload } from '@dcloudio/uni-app'
	import { reactive } from 'vue'
	import { $getAdvert } from '@/http/apiManager.js'
	import appConfig from '@/config/appConfig.js'
	import theme from '@/config/theme.js'
	
	const vdata = reactive({
		amount: '0', // 订单金额
		payOrderId: '', // 订单号
		doubleToThousands: doubleToThousands(),
		primaryColor: '',
		advertUrl: ''
	})
	
	onLoad((params) => {
		vdata.amount = params.amount
		vdata.primaryColor = theme.changeColors()
		vdata.member = params.member
		
		if (params.payOrderId) {
			vdata.payOrderId = params.payOrderId
		}
		
		$getAdvert().then(({bizData}) => {
			if(bizData) {
				vdata.advertUrl = bizData.imgUrl || ''
				vdata.linkUrl = bizData.linkUrl || ''
			}
		}).catch(err => {
		    console.log(err);
		})
	})
	function back() {
		uni.navigateBack()
	}
	function backMiniFunc() {
		uni.navigateBackMiniProgram({
		  extraData: {
		    'amount': vdata.amount,
			'payOrderId': vdata.payOrderId
		  },
		  success(res) {
		    console.log('返回成功')
		  }
		})
	}
	const toH5 = ()=>{
		if(!vdata.linkUrl) return
		uni.navigateTo({
			url: '/pages/H5/H5?url='+ vdata.linkUrl
		})
	} 
	onUnload(()=>{
		console.log('页面卸载');
		uni.$emit('onRechargeSuccess',true)
	})
</script>
<style lang="scss">
	.pay-result {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.pay-result-icon {
		padding-top: 120rpx;
		width: 240rpx;
		height: 166rpx;
	}
	.pay-result-err {
		// padding-top: 30rpx;
		font-size: 34rpx;
		font-weight: 600;
		color: #242526;
	}
	.pay-result-msg {
		width: 75%;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-top: 70rpx;
		color: #999999;
		
		.msg {
			line-height: 42rpx;
		}
	}
	.pay-result-amount {
		padding-top: 34rpx;
		
		.pay-result-amount-text{
			font-size: 28rpx;
			font-family: HiraginoSansGB-W3, HiraginoSansGB;
			color: #303132;
		}
		.pay-result-amount-value {
			font-size: 36rpx;
			font-family: HiraginoSansGB-W3, HiraginoSansGB;
			font-weight: 600;
			color: #FC0100;
		}
	}
	.back-btn {
		position: fixed;
		bottom: 260rpx;
		width: 350rpx;
		height: 80rpx;
		border-radius: 6rpx 6rpx 6rpx 6rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #FFFFFF;
	}
	.ad-wrapper{
		margin:  50rpx auto;
		margin-top: 100rpx;
		width: 700rpx;
		min-height: 380rpx;
		display: flex;
		border-radius: 10rpx;
		justify-content: center;
		overflow: hidden;
		image {
			width: 100%;
			
		}
	}
</style>

